{include file="index@index/head_1"}
<link rel="stylesheet" href="__PUBLIC__/static/static/layui/css/layui.css"  media="all">
<link rel="stylesheet" href="__PUBLIC__/static/static/css/yx.css">
<div class="container yx">
    <!--面包屑导航-->
    <nav class="row breadcrumb d-none d-md-flex">
        <span class="breadcrumb-item">当前位置：</span>
        <a class="breadcrumb-item" href="#">首页</a>
        <span class="breadcrumb-item ">
            {switch nid }
            {case 106}成人高考{/case}
            {case 107}同等学力申硕{/case}
            {case 1}自学考试{/case}
            {case 3}网络教育{/case}
            {case 4}招生院校{/case}
            {/switch}</span>
    </nav>
    <div class="row flex-column mb-4">
        <!--省份筛选-->
        {notin name="nid" value="1,3,107"}
        <div class="d-flex flex-row flex-wrap align-items-center condition-box condition-box-1">
            <div class="col-1 f-14 px-0">院校所在地：</div>
            <ul class="col-11 nav">
                <li class="nav-item"><a href="javascript:void(0)" data-id="0" class="nav-link text-gray f-14 {empty name="param.city_id"}yx-active{/empty}">全部</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="1" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='1'}yx-active{/if}{/notempty}">北京</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="2" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='2'}yx-active{/if}{/notempty}">天津</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="3" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='3'}yx-active{/if}{/notempty}">河北</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="4" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='4'}yx-active{/if}{/notempty}">山西</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="5" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='5'}yx-active{/if}{/notempty}">内蒙古</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="6" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='6'}yx-active{/if}{/notempty}">辽宁</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="7" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='7'}yx-active{/if}{/notempty}">吉林</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="8" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='8'}yx-active{/if}{/notempty}">黑龙江</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="9" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='9'}yx-active{/if}{/notempty}">上海</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="10" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='10'}yx-active{/if}{/notempty}">江苏</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="11" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='11'}yx-active{/if}{/notempty}}">浙江</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="12" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='12'}yx-active{/if}{/notempty}">安徽</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="13" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='13'}yx-active{/if}{/notempty}">福建</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="14" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='14'}yx-active{/if}{/notempty}">江西</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="15" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='15'}yx-active{/if}{/notempty}">山东</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="16" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='16'}yx-active{/if}{/notempty}">河南</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="17" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='17'}yx-active{/if}{/notempty}">湖北</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="18" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='18'}yx-active{/if}{/notempty}">湖南</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="19" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='19'}yx-active{/if}{/notempty}">广东</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="20" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='20'}yx-active{/if}{/notempty}">广西</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="21" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='21'}yx-active{/if}{/notempty}">海南</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="22" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='22'}yx-active{/if}{/notempty}">重庆</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="23" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='23'}yx-active{/if}{/notempty}">四川</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="24" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='24'}yx-active{/if}{/notempty}">贵州</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="25" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='25'}yx-active{/if}{/notempty}">云南</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="26" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='26'}yx-active{/if}{/notempty}">西藏</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="27" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='27'}yx-active{/if}{/notempty}">陕西</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="28" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='28'}yx-active{/if}{/notempty}">甘肃</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="29" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='29'}yx-active{/if}{/notempty}">青海</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="30" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='30'}yx-active{/if}{/notempty}">宁夏</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="31" class="nav-link text-gray f-14 {notempty name="param.city_id"}{if $param.city_id =='31'}yx-active{/if}{/notempty}">新疆</a></li>
            </ul>
        </div>
        {/notin}
        <!--院校特征-->
        {in name="nid" value="4"}
        <div class="d-flex flex-row align-items-center condition-box condition-box-2">
            <div class="col-1 tag-title-2 f-14 px-0">院校特征：</div>
            <ul class="col-11 nav">
                <li class="nav-item"><a href="javascript:void(0)" data-id="0" class="nav-link school-tag text-gray f-14 {empty name="param.type"}yx-active{/empty}">全部</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="1" class="nav-link school-tag text-gray {notempty name="param.type"}{if $param.type == 1 }yx-active{/if}{/notempty} f-14">成人高考</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="5" class="nav-link school-tag text-gray {notempty name="param.type"}{if $param.type == 5 }yx-active{/if}{/notempty} f-14">同等学力申硕</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="2" class="nav-link school-tag text-gray {notempty name="param.type"}{if $param.type == 2 }yx-active{/if}{/notempty} f-14">自学考试</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="3" class="nav-link school-tag text-gray {notempty name="param.type"}{if $param.type == 3 }yx-active{/if}{/notempty} f-14">网络教育</a></li>
                <li class="nav-item"><a href="javascript:void(0)" data-id="4" class="nav-link school-tag text-gray {notempty name="param.type"}{if $param.type == 4 }yx-active{/if}{/notempty} f-14">开放教育</a></li>
            </ul>
        </div>
        {/in}
    </div>
    <div class="row">
        <div class="col-9 px-0 pr-3">
            <!--显示信息-->
            <div class="border p-3 d-flex flex-row justify-content-between">
                <div class="order-box" data-order="{$param.order}">
                    排序：
                    <span class="order mr-3 f-14 {empty name="param.order"}yx-active{/empty}"  data-order="">默认</span>
                    <span class="order mr-5 f-14 {notempty name="param.order"}{if $param.order =='asc'}yx-active{/if}{/notempty}" data-order="asc">升序</span>
                    <span class="text-muted f-14" >报名人数默认从高到低</span>
                </div>
                <div class="f-14 fy-group">
                    <span>共<span class="text-blue total" data-total="{$count}">{$count}</span>所院校</span>
                    <a href="javascript:void(0);" class="text-decoration-none pre-btn">&lt;</a>
                    <span><span class="cur" data-cur="{$page}">{$page}</span>/<span data-totle="{$count/10|ceil}" class="total-group">{$count/10|ceil}</span></span>
                    <a href="javascript:void(0);" class="text-decoration-none next-btn">&gt;</a>
                </div>
            </div>
            <!--学校-->
            {volist name="list" id="vo"}
            <div class="row border-bottom pt-4 pb-4 mx-0">
                <!--学校信息-->
                <div class="col-7 border-right">
                    <div class="row">
                        <div class="col-4"><img class="img-fluid" src="{$vo.school_logo}" alt=""></div>
                        <div class="col-8">
                            <h5 class="text-truncate yx-title">{$vo.school_name}</h5>
                            <ul class="nav tag">
                                {volist name="vo.label" id="v"}
                                <li class="nav-item px-2">{$v}</li>
                                {/volist}
                            </ul>
                            <div class="d-flex flex-column text-muted mt-2">
                                <div class="mr-2 f-14">层次：<span >{$vo.level}</span>
                                </div>
                                <div class="f-14">累计报读：<span>{$vo.number}</span>
                                </div>
                            </div>
                            <div class="mt-3">
                                <a href="" class="btn btn-blue mr-5 f-14 py-1">招生简章</a>
                                <a href="{:u($nid_t,$vo.school_id)}" class="btn btn-blue f-14 py-1">院校详情</a>
                            </div>
                        </div>
                    </div>
                </div>
                <!--推荐专业-->
                <div class="col-5">
                    <h4 class="text-center mb-4">--推荐专业--</h4>
                    <div class="row">
                        {volist name="vo.recommended" id="s"}
                        <div class="col-6 mb-3">
                            <a href="javascript:void(0)" class="tag-1 text-truncate">{$s}</a>
                        </div>
                        {/volist}
                    </div>
                </div>
            </div>
            {/volist}
            <!--分页-->
            <div id="yx-pagination" class="pagination mt-5 justify-content-center"></div>
        </div>
        <!--右侧-->
        <div class="col-3 pr-0">
            <div class="border hot-yx mb-5">
                <h5 class="text-center short-line font-weight-bold">热门院校</h5>
                <!--轮播图-->
                <div id="yx-slider" class="carousel slide" data-ride="carousel">
                    <!-- 轮播图片 -->
                    <div class="carousel-inner">
                        {volist name="school" id="v" key='key'}
                        <div class="carousel-item {if condition="$key eq 1"}active{/if}">
                            <img src="{$v.school_logo}">
                            <h6 class="text-truncate">{$v.school_name}</h6>
                            <ul class="nav slider-tag tag">
                                {volist name="v.label" id="v"}
                                <li class="nav-item">{$v}</li>
                                {/volist}
                            </ul>
                        </div>
                        {/volist}
                    </div>

                    <!-- 左右切换按钮 -->
                    <a class="slider-control carousel-control-prev" href="#yx-slider" data-slide="prev">
                        <span class="carousel-control-prev-icon"></span>
                    </a>
                    <a class="slider-control carousel-control-next" href="#yx-slider" data-slide="next">
                        <span class="carousel-control-next-icon"></span>
                    </a>
                </div>
                <div class="text-center mt-3"><a href="" class="btn btn-blue bm f-14">立即报名>></a></div>
            </div>
            <!--报考指南-->
            <div>
                <h5 class="text-center zhinan short-line">报考指南</h5>
                <ul class="nav flex-column zhinan-list">
                    {sy:list nid="2" cid="110" name="vo" sort="sort desc,id desc" num="0,5"} 
                    <li class='nav-item' style='width: 285px'><a href="{:u('news',$vo.id)}" class='nav-link text-truncate'>{$vo.title}</a></li>
                    {/sy:list}
                </ul>
                <div class="text-center">
                    <button type="button" class="btn btn-blue px-4 f-14" onclick="changeData()">换一批</button>
                </div>
            </div>
        </div>
    </div>
</div>

{include file="index@index/foot"}
<script src="__PUBLIC__/static/static/layui/layui.js" charset="utf-8"></script>
<script>

$(function(){
    //轮播图2初始化
    $("#yx-slider").carousel();

    //筛选点击事件
    let city_id = ''; //城市id
    let type = '';//学校特征
    let order = 'desc';//降序
    let page = '1';//当前页
    let total = 0;//总条数
    const limit = 10;//一页显示条数
    //获取总条数
    total = parseInt($(".total").attr("data-total"));
    //获取当前page
    page = parseInt($(".cur").attr("data-cur"));
    //获取排序
    order = $(".order-box").attr("data-order");
    //是否存在数据
    if(total){
        layui.use(['laypage'], function() {
            var laypage = layui.laypage;
            laypage.render({
                elem: 'yx-pagination'
                ,count: total
                ,limit:limit
                ,curr:page
                ,jump:function (obj,first) {

                    if(!first){
                        layer.msg('加载中', {
                            icon: 16
                            ,shade: 0.01
                        });
                        location.href = window.location.pathname+'?page='+obj.curr+'&city_id='+city_id+'&type='+type+'&order='+order;
                    }
                }
            });
        });
    }else{
        $("#yx-pagination").html("暂无数据");
    }

    //点击切换，不需要可删除
    $(".condition-box-1 a").click(function(){
        layer.msg('加载中', {
            icon: 16
            ,shade: 0.01
        });
        $(".condition-box-1 a").removeClass("yx-active");
        $(this).addClass("yx-active");
        //城市筛选
        city_id =$(this).attr("data-id");
        window.location.href = window.location.pathname+'?page='+page+'&city_id='+city_id+'&type='+type+'&order='+order;
    })
    $(".condition-box-2 a").click(function(){
        layer.msg('加载中', {
            icon: 16
            ,shade: 0.01
        });
        $(".condition-box-2 a").removeClass("yx-active");
        $(this).addClass("yx-active");
        //学校特征
        type =$(this).attr("data-id");
        window.location.href = window.location.pathname+'?page='+page+'&city_id='+city_id+'&type='+type+'&order='+order;
    })
    //排序
    $(".order").click(function(){
        layer.msg('加载中', {
            icon: 16
            ,shade: 0.01
        });
        $(".order-box .order").removeClass("yx-active");
        $(this).addClass("yx-active");
        //排序
        order =$(this).attr("data-order");
        window.location.href = window.location.pathname+'?page='+page+'&city_id='+city_id+'&type='+type+'&order='+order;
    })
    //翻页,上一页
    $(".pre-btn").click(function(){
        if(page>1){
            layer.msg('加载中', {
                icon: 16
                ,shade: 0.01
            });
            $(".fy-group a").removeClass("disabled");
            page--;
            window.location.href = window.location.pathname+'?page='+page+'&city_id='+city_id+'&type='+type+'&order='+order;
        }else{
            $(this).addClass("disabled");
        }
    })
    //下一页
    $(".next-btn").click(function(){
        if(page<total){
            layer.msg('加载中', {
                icon: 16
                ,shade: 0.01
            });
            $(".fy-group a").removeClass("disabled");
            page++;
            window.location.href = window.location.pathname+'?page='+page+'&city_id='+city_id+'&type='+type+'&order='+order;
        }else{
            //不能点击
            $(this).addClass("disabled");
        }
    })






})
//换一批
function changeData(){
    $.ajax({
        url:"/random",
        type:"POST",
        success:function(res){
            console.log(JSON.parse(res));
            res = JSON.parse(res);
            var li = "";
            if(res.length){
                for(var i in res){
                    li += "<li class='nav-item' style='width: 285px'><a href='{:u(\'news\',"+res[i].id+")}' class='nav-link text-truncate'>"+res[i].title+"</a></li>";
                }
            }else{
                li = "<li class='nav-item' style='width: 285px'>暂无数据</li>"
            }
            $(".zhinan-list").html(li);
        },
        error:function(e){
            $(".zhinan-list").html("服务器错误 500");
        }
    })
}
</script>
